<template>
    <div>
        <el-card>
            <div slot="header">
                <span>预案执行指标</span>
            </div>
            <div class="content">
                <div class='content-item'>
                    <div>{{data.equipmentCount}}</div>
                    设备总数
                </div>
                <div class='content-item'>
                    <div>{{data.faultCount}}</div>
                    异常设备数量
                </div>
                <div class='content-item'>
                    <div>{{(data.equipmentCount - data.faultCount)/data.equipmentCount | formatPercent}}</div>
                    设备完好率
                </div>
            </div>
            <HR align=center width='100%' color=#987cb9 SIZE=1 style="margin: 10px 0px;"/>
            <div style="text-align: center;">
                <el-button>数据刷新</el-button>
                <el-button>统计报表</el-button>
            </div>
        </el-card>
    </div>
</template>
<script>

import reportService from '../../../services/reportService'

export default {

    data(){
        return{
            data: {}
        }
    },


    props: {
        // tunnelcode: {
        //     type: 'Strting',
        //     required: true
        // }
    },

    mounted(){
        let _this = this
        reportService.getfacilityTarget().then(res => {
            if (res.msg == 'success') {
                _this.data = res.data
            }
        })
    },

    wahch: {
        // tunnelcode (n, o){
            // reportService.
        // }
    }


}
</script>
<style lang="scss" scoped>

.fl-r{
    float: right;
}

.content{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.content-item{
    text-align: center;
}
</style>
